import { getData } from "../network/index.js";

// getData().then((res) => console.log(res, "res"));

// console.log("$", $);

// 保证 layui 和 jQuery 已经引入
layui.use("element", function () {
  var element = layui.element; // 初始化 layui 的折叠面板
  // 获取数据并渲染
  getData().then(function (res) {
    // if (res.code !== 200) return;
    //1高亮所有 关键字
    const keywords = [];

    res.data.forEach(function (domain, idx) {
      domain.fields.forEach((item, index) => {
        keywords.push(item.key);
      });
    });

    setTimeout(() => {
      console.log(keywords);

      searchText(keywords);
    }, 800);
    //2渲染 右侧列表
    var html = "";
    res.data.forEach(function (domain, idx) {
      html += `
          <div class="layui-colla-item">
            <div class="layui-colla-title">${domain.title}</div>
            <div class="layui-colla-content${idx === 0 ? " layui-show" : ""}">
              <ul>
                ${domain.fields
                  .map(
                    (field) => `
                   <div class="layui-form-item" style=" display:flex" data-key="${field.key}">
                    <label class="layui-form-label" style="color:#215EC5;font-size:18px">${field.code}</label>
                           <div class="layui-input-inline layui-input-wrap">
                                <input type="text" placeholder="请输入"  name="vercode" lay-verify="required" autocomplete="off" lay-affix="clear" class="layui-input">
                            </div>                  
                    </div>`
                  )
                  .join("")}
              </ul>
            </div>
          </div>
        `;
    });
    $("#domainCollapse").html(html);
    element.render("collapse"); // 重新渲染 layui 折叠面板
  });
});

$("#domainCollapse").on("click", ".layui-form-item", function () {
  const key = $(this).data("key"); //关键字
  const index = $(this).index(); // 获取当前项的索引
  const domainIndex = $(this).closest(".layui-colla-item").index(); // 获取所属域的索引

  console.log("点击的项索引:", index);
  console.log("所属域索引:", domainIndex);
  console.log("关键字:", key);

  searchText(key);

  $(".layui-form-item").removeClass("active"); // 先移除所有
  $(this).addClass("active"); // 当前加上
});
